/* general */
body {
    font-family: Gill Sans MT;
    font-size: 14px;
    color: #000;
	border:none;
	outline:none;
	
	
}

a {cursor:pointer;}

.scrollbar{

    height:315px;
    margin-bottom:30px;
    overflow-y:scroll;
    float:left;
    }
    
    #ex3::-webkit-scrollbar{
    width:16px;
    background-color:#fff;
    border-radius:8px;
    } 
    #ex3::-webkit-scrollbar-track{
    border:1px gray solid;
    border-radius:10px;
    
    } 
    #ex3::-webkit-scrollbar-thumb{
    background-color:#29b0e5;
    border-radius:10px;
    border:1px solid #fff;
    
    }
    #ex3::-webkit-scrollbar-thumb:hover{
    background-color:#29b0e5;
    border:1px solid #fff;
    }
    #ex3::-webkit-scrollbar-thumb:active{
    background-color:#29b0e5;
    border:1px solid #fff;
    } 

    #templatemo_services{
        padding-top: 120px;
        }
    
        #templatemo_services{
            padding-top: 120px;
            }
        
        @media only screen and (max-width: 1000px){
        
            #templatemo_services{
            padding-top: 970px;
            }
            
        }

        .footernav{
            float:left;
            width:44%;
            }
    .leftf{
        width:28%;
        float:left;
        }
    .rightf{
        float:right;
        width:22%;
        text-align:right;
        }
    .footernav ul li{
        list-style:none;
        float:left;
        margin-left:10px;
        color:#fff;
        }
    .footernav ul{
    width:387px;
    margin:0 auto;
        }
    .footernav ul li a{
        text-decoration:none;
        font-size:15px;
        color:#fff;
        }
    .footernav ul li a:hover{
        text-decoration:underline;
        }
        .foothead{
            width:100%;
            background:#7d7f83;
            padding:30px 0px 10px 0px;
            
            
            }
        
        
            @media only screen and (max-width: 1850px){
                .foothead{
                      width:100%;
                      background:#7d7f83;
                      padding:30px 0px 10px 0px;
    
                      }
                  
              }
       
              
    
    
          
    
    
    
    .social{
        height:110px;
        width:26px;
        position:fixed;
    top:115px;
        z-index:999;
        }
    .social img:hover{
        width:35px;
        transition: 0.7s all;
    -webkit-transition: 0.7s all;
    -moz-transition: 0.7s all;
    -o-transition: 0.7s all;
        }
    h1,h2, h3, h4, h5, h6 {
        font-family: Gill Sans MT;
        line-height: 1.1em;
        margin-bottom: 20px;
        color:#29b0e5;
    }
    h1 {
        text-align: center;
        margin-top: 30px;
        margin-bottom: 30px;
    }
    
    .margin_top { margin-top: 20px; }
    
    /* header */
    header {
        
        width: 100%;
        background: #fff;
        position: fixed;
        left: 0;
        top: 0;
        z-index: 200;
        padding-left: 50px;
       
    }
    header #templatemo_logo {
        padding-top: 35px;
        float: left;
    }
    header #templatemo_logo img {
        width: 100%;
        position: absolute;
        top: -70px;
        left: 1470px;
    }
    
    
    
    header ul {
        float: left;
        min-height: 60px;
        margin-top: 30px;
    }
    header ul li {
        margin: 0;
        padding: 0;
        list-style: none;
        float: left;
        height: 45px;
    }
    header ul li a {
        font: normal normal normal 18px/20px Gill Sans MT;
        text-align: center;
        float: left;
        color: #a7a9ac;
        
    }
    .header ul li:hover a{
        color:#29b0e5;
        }
    header ul li:active a, header ul li:focus a, header ul li a.current{
        color: #29b0e5;
        border: 1px solid #29b0e5;
        text-decoration: none;
    }
    header .nav li a:hover, header .nav li a:focus {
        background-color: #fff;
        color: #29b0e5;
    }
    
    @media only screen and (max-width: 1850px){
    
        header {
            padding-left: 0px;
            }
    
        header #templatemo_logo img {
            width: 200px;
            position: absolute;
            top: -50px;
            left: -10px;
        }
    
        
        header ul {
            float: left;
            min-height: 60px;
            margin-top: 30px;
            
          
        }
        header ul li {
            margin: 0;
            padding: 0;
            list-style: none;
            float: left;
            height: 45px;
            right: 250px;
        }
        header ul li a {
            font: normal normal normal 18px/20px Gill Sans MT;
            text-align: center;
            float: left;
            color: #a7a9ac;
            
            
        }
    
    }
    
    
    
    @media only screen and (max-width: 1000px){
    
        header #templatemo_logo img {
            width: 220px;
            position: absolute;
            top: -65px;
            left: -140px;
        }
    
        header ul {
            float: left;
            min-height: 60px;
            margin-top: 30px;
     
        }
        header ul li {
            margin: 0;
            padding: 0;
            list-style: none;
            float: left;
            height: 45px;
            right: -30px;
            
        }
        header ul li a {
            font: normal normal normal 18px/20px Gill Sans MT;
            text-align: center;
            float: left;
            color: #555657;
            
        }
    
    }
    
/* scroll */
.scrollup {
    position: fixed;
    width: 55px;
    height: 55px;
    bottom: 65px;
    right: 18px;
    background: #222;
    background: url("../images/templatemo_arrow.png")no-repeat;
	z-index:9;
}

#templatemo_services p {
    font-size: 14px;
    line-height: 20px;
    font-family: Gill Sans MT;
    color: #000;
    text-align: left;
}
#templatemo_services .row {
    padding-bottom: 30px;
}

@media only screen and (max-width: 1000px){

    #templatemo_services{
		margin-top: -800px;

	}

	#templatemo_services .row {
    padding-bottom: 30px;
		margin-left: 100px;
}
}


.thumbs {
    margin: 0;
    padding: 0;
	float: left;
/*overflow: scroll;
height: 328px;
overflow-x: hidden;
scroll-base-color: #9999cc;
scroll-base-color: orange; 
scroll-arrow-color: green;
scroll-DarkShadow-Color: blue; */
}
.thumbs li {
    list-style: none;
    margin-bottom: 30px;
}
.thumbs li.item-thumbs div {
    width: 100%;
    height: 100%;
    float: left;
    background: #71def3;
    position: relative;
	border-radius:5px;
	padding:4px;
	border:1px solid rgba(255,255,255, 0.5);
}
.thumbs li.item-thumbs .overlay {
   position: absolute;
width: 96%;
height: 95%;

z-index: 5;
/* top: 0; */
/* left: 0; */
opacity: 0.6;
transition: all 450ms ease-out 0s;
text-decoration: none;
/* -webkit-transform: scale(0.5,0.5); */
/* transform: scale(0.5,0.5); */
-webkit-transition: .5s;
transition: .5s;
border-radius: 1px;
}
.thumbs li.item-thumbs:hover .overlay {
   
    background:none;
	opacity:1;
}

.thumbs li.item-thumbs img {
    float: left;
    width: 200px;
	height:250px;
}

.scrollbar ul li{
    filter: grayscale(100%);
    transition: all .3s ease-in-out; 
}

.scrollbar ul :hover{
    filter: grayscale(0%);
}
  

/*responsive setting*/
@media (min-width: 1025px) {
    header ul li {
        margin: 10px 10px 0 10px;
    }
    header ul li a {
        margin: 0;
        padding: 0 5% 0 5%;
    }
    #templatemo_services p {
        line-height: 30px;
        padding: 17px 0;
    }
}

    @media (min-width: 768px) and (max-width: 992px) {
        header ul li {
            margin: 10px 0 0 0;
            padding: 0;
        }
        header ul li a {
            margin: 0;
            padding: 0 12px 0 12px !important;
        }

        #templatemo_services p {
            font-size: 14px;
            line-height: 18px;
            padding: 3px 0;
        }
    }

        .socialfooter{
            display:none;
            }

            @media (min-width: 994px) and (max-width: 1060px) {
                .col-sm-18{
                    width:67% !important;
                    }	
                    }
                    @media (min-width: 768px) and (max-width: 994px) {
                .col-sm-18{
                    width:69% !important;
                    
                    }
                    .artli{top:40px;}	
                    }
                    
                    @media (max-width: 1024px) {
                        
                    .thumbs li
                    {
                        padding-left:0 !important;
                        padding-right:1px !important;
                    }
                    }
                    @media (min-width: 1025px) and (max-width: 1199px) {
                        .thumbs li{
                        padding-right:3px !important;
                        }}
                    
        @media (min-width: 200px) and (max-width: 1060px) {
            .footernav{
                display:none;
                }
            .leftf{
                width:50%;
                }
                .rightf{
                    width:50%;
                    }
            
            .social{
                display:none;
                }
                .socialfooter{
                    display:block;
                    width:120px;
                    margin:0 auto;
                    padding-bottom:7px;
                    }
                .socialfooter a{
                    opacity:0.5;
                    }
                    .socialfooter a:hover{
                        opacity:1;
                        }
                }
            
                #gallery1 a{
                    opacity:0.60;
                    
                    }
                    #gallery1 a:hover{
                        opacity:1;
                        transition: all 450ms ease-out 0s;transition: .5s;
                        }

                        @media only screen and (max-width: 1000px){

	
                            #templatemo-nav-bar ul{
                                position: relative;  
                                display: flex;
                                margin-right: -250px;
                            
                            }
                        
                        }
        
        
        
        @media (min-width: 768px) and (max-width: 1024px) {
                    
                    header ul li a{
                        font-size:22px !important;
                       
                        }
                    }
                    .thumbs p{
                        width: 166px;
        line-height: 20px !important;
        margin: 0 !important;
        padding: 0 4px !important;
        color:#77787a !important;
        font-size:15px !important;
        text-align:center !important;
        }
            